<!DOCTYPE html>
<html lang="en" class="h-100">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <title>ESP Launchpad</title>
    <!-- Favicon-->
    <link rel="icon" type="image/x-icon" href="../assets/favicon.ico" />
    <!-- Core theme CSS (includes Bootstrap)-->
    <link href="../css/styles.css" rel="stylesheet" />
    <link href="../css/custom.css" rel="stylesheet" />
    <link href="../css/xterm.css" rel="stylesheet" />
    <link rel="stylesheet" href="./minimal_ui_styles.css" />
</head>

<body class="d-flex flex-column h-100" style="align-items: center">
    <!-- Modal for reset device starts-->

    <div id="main" class="maincontainer">
        <!-- Responsive navbar-->
        <nav class="navbar navbar-expand-lg">
            <div class="container">
                <h4 class="topic" data-target-tab-panel-id="about">
                    <img src="../assets/logo-v1.png" class="logo" />
                </h4>
            </div>
        </nav>
        <div class="container" id="alert-container" style="display: none;">
            <div class="text-center mt-3 intro-text">
                <div class="alert alert-warning alert-dismissible fade show" role="alert">
                    <label style="display:none" id="lblConnTo"></label>
                </div>
            </div>
        </div>
        <div style="margin-top: auto">
            <button class="connectButton" id="connectButton" tabindex="0" type="button">Connect Your Device<span
                    class="span-svg"><svg class="svg" focusable="false" aria-hidden="true" viewBox="0 0 24 24"
                        data-testid="EastIcon">
                        <path fill="#FFFFFF" d="m15 5-1.41 1.41L18.17 11H2v2h16.17l-4.59 4.59L15 19l7-7-7-7z"></path>
                    </svg></span></button>
        </div>
        <div id="spinner" style="display: none">
            <div>
                <div class="spinner-grow text-secondary bg-opacity-25" role="status">
                    <span class="sr-only"></span>
                </div>
                <div class="spinner-grow text-secondary bg-opacity-50" role="status">
                    <span class="sr-only"></span>
                </div>
                <div class="spinner-grow text-secondary bg-opacity-75" role="status">
                    <span class="sr-only"></span>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row split">
                <div class="productinfocontainer" id="productInfoContainer">
                    <div id="message" style="display: none"></div>
                </div>
                <div class="col-12 terminalcontainer" style="overflow: hidden; display: none;" id="terminalContainer">
                        <div class="button-container text-end mb-sm-3">
                            <div class="field-container" data-toggle="tooltip" data-placement="right"
                                title="Restart your device" style="display: inline-block">
                                <button type="button" class="app-button btn btn-outline-dark" id="consoleStartButton"
                                    disabled>
                                    Restart Device
                                </button>
                            </div>
                        </div>
                        <div id="terminal"><span class="devicelog">Device logs</span></div>
                </div>
            </div>
        </div>
    </div>

    <!-- Safari & FireFox not supported error message-->
    <div id="unsupportedBrowserErr" style="display: none">
        <p align="center" style="color: red">
            This tool is not supported on Safari & Firefox browsers yet! Please try
            using another browser like Google Chrome.
            <br />
            <br />
            ESP Launchpad makes use of WebUSB to communicate with the device.
            Currently Safari & Firefox browsers don't support it yet. We will add
            support for this browser as soon as Safari & Firefox starts supporting
            WebUSB.
        </p>
    </div>


    <!-- Third party libraries-->
    <script src="../node_modules/xterm/lib/xterm.js"></script>
    <script src="../node_modules/xterm-addon-fit/lib/xterm-addon-fit.js"></script>
    <script src="../node_modules/crypto-js/crypto-js.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pako/2.0.3/pako.js"></script>
    <script type="text/javascript" src="../node_modules/toml-js/src/toml.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js"></script>

    <script src="./minimal_ui_index.js" type="module"></script>
    <!-- Bootstrap core JS-->
    <script src="../js/jquery.min.js"></script>
    <script src="../js/bootstrap.bundle.min.js"></script>
    <script src="../js/qrcode.min.js"></script>
</body>

</html>